import React from 'react'
import { Button } from 'react-vant';
import { getStatic } from '../../../api/yjr/yjr_api';
import { useNavigate } from 'react-router-dom';


export default React.memo( function ViewProductCard({ item }: any) {

    const navigate = useNavigate()
    const handleAffirm = async (id: object) => {
        const res = JSON.parse(sessionStorage.getItem('details') || '[]') || []

        if (Array.isArray(res)) {
            res.map(ele => {
                if (ele._id === id) {
                    ele.data = 4
                }
            })
        }

        sessionStorage.setItem('details', JSON.stringify(res))

        window.location.reload()
    }

    const handleOrder = (id: string) => {
        navigate(`/order/${id}`)
    }

    const handleCancel = async (id: object) => {
        await getStatic(id, 3)
        window.location.reload()
    }

    return (
        <div>
            {item.data != 0 ?
                <div>
                    {item.data == 1 ?
                        <div>
                            <Button
                                size="mini"
                                round
                                plain
                                style={{
                                    width: '9rem',
                                    marginRight: 2,
                                    background: '#fafafa',
                                    color: 'red'
                                }}
                                onClick={() => handleCancel(item._id)}
                            >
                                取消订单
                            </Button>
                            <Button
                                size="mini"
                                round
                                plain
                                style={{
                                    width: '9rem',
                                    marginRight: 2,
                                    background: 'red',
                                    color: 'white'
                                }}
                                onClick={() => handleOrder(item._id)}
                            >
                                去兑换
                            </Button>
                        </div> : null
                    }
                    {item.data == 2 ?
                        <div>
                            <div>
                                <Button
                                    size="mini"
                                    round
                                    plain
                                    style={{
                                        width: '9rem',
                                        marginRight: 2,
                                        background: '#fafafa',
                                        color: 'red'
                                    }}
                                >
                                    查看物流
                                </Button>
                                <Button
                                    size="mini"
                                    round
                                    plain
                                    style={{
                                        width: '9rem',
                                        marginRight: 2,
                                        background: 'red',
                                        color: 'white'
                                    }}
                                    onClick={() => handleAffirm(item._id)}
                                >
                                    确认收货
                                </Button>
                            </div>
                        </div> : null
                    }
                </div> : null
            }
        </div>
    )
})
